import React from 'react';
import { connect } from 'react-redux';
import CommonList from '../../../../components/CommonLists/list';
import { Button } from 'antd';
import PolicyModal from './policyModal';
import FieldModal from '../../../Variable/Field/add';
import PolicyDetail from './policyDetail';
import { STRATEGY_TYPE } from '../../../../utils/constant';
import Modal from '../../../../components/Modal/index';
import Result from '../../../../components/Result';
import CodeLabel from '../../../../components/CodeLabel';

function mapStateToProps(state) {
  return {
    hit_handle: state.code.hit_handle
  };
}

@connect(mapStateToProps)
class CheckList extends CommonList {
  constructor(props) {
    super(props);
    this.api = 'caseApi';
    this.detailLink = record => {
      return (
        <Button type='link' onClick={this.showPolicyDetail.bind(this, record)}>
          数据详情
        </Button>
      );
    };
    this.btnGroup = [this.detailLink];
    this.tableParams = {
      pagination: false
    };
    this.showModal = '';
  }

  showPolicyDetail = record => {
    Modal.open({
      title: '数据详情',
      width: this.model_width ? this.model_width : '1000px',
      content: (
        <PolicyDetail
          record={record}
          isFlow={record.strategy_type === STRATEGY_TYPE._FLOW}
          {...this.props}
          base_data={record.base_data}
          business_data={record.business_data}
          showPolicy={this.showPolicy}
          showField={this.showField}
          editFunction={this.props.editFunction}
        />
      ),
      isOkBtn: true,
      maskClosable: false,
      isCancelBtn: true,
      ok: () => {
        Modal.close();
      }
    });
  };

  showPolicy = (record, actionType) => {
    this.showModal = Modal.open({
      title: '策略详情',
      width: this.model_width ? this.model_width : '1200px',
      content: (
        <PolicyModal
          record={record}
          {...this.props}
          actionType={actionType || 'detail'}
          afterSubmit={this.afterSubmit}
          model={false}
        />
      ),
      isOkBtn: true,
      maskClosable: false,
      isCancelBtn: true,
      ok: () => {
        Modal.close();
      }
    });
  };

  showField = (record, actionType) => {
    this.showModal = Modal.open({
      title: '查看字段',
      width: this.model_width ? this.model_width : '1200px',
      content: (
        <FieldModal record={{ field_id: record.field_id }} {...this.props} actionType={actionType || 'detail'} />
      ),
      isOkBtn: false,
      maskClosable: false,
      isCancelBtn: false
    });
  };

  afterSubmit = () => {
    Modal.close(this.showModal);
    this.showModal = '';
  };

  getColumn = () => {
    return [
      {
        title: '序号',
        key: 'strategy_id',
        dataIndex: 'strategy_id',
        width: 60,
        render: (text, record, index) => `${index + 1}`
      },
      {
        title: '策略名称',
        key: 'strategy_name',
        dataIndex: 'strategy_name',
        width: '25%',
        render: (text, record) => {
          return (
            <>
              <Button type='link' onClick={() => this.showPolicy(record)}>
                {record.strategy_name}
              </Button>
            </>
          );
        },
        ellipsis: true
      },
      {
        title: '策略类型',
        key: 'strategy_type_name',
        dataIndex: 'strategy_type_name'
      },
      {
        title: '策略模式',
        key: 'strategy_mode_name',
        dataIndex: 'strategy_mode_name'
      },
      {
        title: '优先级',
        key: 'prior',
        dataIndex: 'prior'
      },
      {
        title: '执行结果',
        key: 'hit_result',
        dataIndex: 'hit_result',
        render: text => {
          return (
            <>
              {text ? (
                <Result value={text}>
                  <CodeLabel code='hit_handle' value={text} />
                </Result>
              ) : (
                  text
                )}
            </>
          );
        }
      },
      {
        title: '备注',
        key: 'comments',
        dataIndex: 'comments'
      }
    ];
  };

  refreshTableFilter = params => {
    this.props.refreshTableFilter && this.props.refreshTableFilter(params);
  };
}

export default CheckList;
